import React, { useEffect, useReducer, Reducer } from 'react';
interface Action {
  type: 'add' | 'minus';
  num: number;
}
//闭包陷阱解决方案：1.传入函数
function reducer(state: number, action: Action) {
  switch (action.type) {
    case 'add':
      return state + action.num;
    case 'minus':
      return state - action.num;
  }
  return state;
}
export default function Four() {
  const [count, dispatch] = useReducer<Reducer<number, Action>>(reducer, 0);

  useEffect(() => {
    console.log(count);
    setInterval(() => {
      dispatch({ type: 'add', num: 1 });
    }, 1000);
  }, []);

  return (
    <>
      <div>{count}</div>
    </>
  );
}
